<template>
	<div class="password-wrap">
		<div class="ms-title">修改密码</div>
		<div class="ms-pwd">
			<el-form ref="pwdForm" label-width="0px">
				<el-form-item>
					<el-input type="text" v-model="pwd.userCd" placeholder="用户编码"></el-input>
				</el-form-item>
				<el-form-item>
					<el-input type="password" v-model="pwd.oldPassword" placeholder="旧密码"></el-input>
				</el-form-item>
				<el-form-item>
					<el-input type="password" v-model="pwd.newPassword" placeholder="新密码"></el-input>
				</el-form-item>
				<el-form-item>
					<el-input type="password" v-model="pwd.newPassword1" placeholder="确认密码"></el-input>
				</el-form-item>
				<el-row>
					<el-col :span="12">
						<div class="pwd-btn">
							<el-button type="primary" @click="handleCancel">取消</el-button>
						</div>
					</el-col>
					<el-col :span="12">
						<div class="pwd-btn">
							<el-button type="primary" @click="handleUpdatePwd">提交</el-button>
						</div>
					</el-col>
				</el-row>
			</el-form>

		</div>

	</div>
</template>

<script>
	import cmscommon from '@/utils/cmscommon'
	import interfaces from '@/interfaces'
	import Vue from 'Vue'
	export default {
		data() {
			return {
				pwd: {
					userCd: '111111111',
					oldPassword: '',
					newPassword: '',
					newPassword1: ''
				}
			}
		},
		methods: {
			success(data) {
				console.log(data);
				if(data.data.code == 0) {
					this.$message({
						message: '密码修改成功！',
						type: 'success'
					});
					this.$router.push({
						path: '/home'
					})
				} else {
					this.$message({
						message: data.data.code + ":" + data.data.msg,
						type: 'error'
					})
				}
			},
			fail(data) {
				this.$message({
					message: data.response.data.status + ":" + data.response.data.error,
					type: 'error'
				})
			},
			handleUpdatePwd: function() {
				console.log("进入密码修改");
				const _this = this;
				const passwordParams = {
					"userCd": _this.pwd.userCd,
					"oldPassword": _this.pwd.oldPassword,
					"newPassword": _this.pwd.newPassword
				};
				cmscommon.send({
					method: "PUT",
					url: interfaces.updatePwd,
					data: passwordParams
				}).then(this.success).catch(this.fail);
			},
			handleCancel: function() {
				console.log("进入取消密码修改");
				this.$router.push({
					path: '/test'
				})
			}
		}
	}
</script>

<style>
	.password-wrap {
		position: relative;
		width: 50%;
		height: 50%;
	}
	
	.ms-title {
		position: absolute;
		top: 50%;
		width: 100%;
		margin-top: -230px;
		text-align: center;
		font-size: 30px;
		color: #fff;
	}
	
	.ms-pwd {
		position: absolute;
		left: 50%;
		top: 50%;
		width: 300px;
		height: 160px;
		margin: -150px 0 0 -190px;
		padding: 40px;
		border-radius: 5px;
		background: #fff;
	}
	
	.pwd-btn {
		text-align: center;
	}
	
	.pwd-btn button {
		width: 50%;
		height: 36px;
	}
</style>